/**
 * @author lulongwen
 * Date: 2023-08-27 17:00
 * Description:
 */
import { memo } from 'react';
import { Handle, Position, NodeToolbar } from 'reactflow';
import { Button } from 'antd';
import {
  DeleteOutlined,
  CopyOutlined,
  ExpandAltOutlined
} from '@ant-design/icons';

const CustomNode = ({ data }: any) => {
  return (
    <>
      <NodeToolbar
        isVisible={data.toolbarVisible}
        position={data.toolbarPosition}
      >
        <Button size='small' type='text'>
          <DeleteOutlined className='text-red-600' />
        </Button>
        <Button size='small' type='text'>
          <CopyOutlined className='text-blue-600' />
        </Button>
        <Button size='small' type='text'>
          <ExpandAltOutlined />
        </Button>
      </NodeToolbar>

      <div style={{ padding: '10px 20px' }}>{data.label}</div>
      <Handle type='target' position={Position.Left} />
      <Handle type='source' position={Position.Right} />
    </>
  );
};

export default memo(CustomNode);
